<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>

<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html lang="en"> <!--<![endif]-->

<head>

    <!-- Basic Page Needs
  ================================================== -->
	<meta charset="utf-8">
	<title>ChinaZ</title>
	<meta name="description" content="">
	<meta name="author" content="">
	
    <!-- Mobile Specific Metas
  ================================================== -->
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    
    <!-- CSS
  ================================================== -->
	  <link rel="stylesheet" href="css/zerogrid.css">
	  <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	  <link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/slide.css">
	<link rel="stylesheet" href="css/menu.css">
	<!-- Custom Fonts -->
    <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
	<!--[if lt IE 8]>
       <div style=' clear: both; text-align:center; position: relative;'>
         <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode">
           <img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
        </a>
      </div>
    <![endif]-->
    <!--[if lt IE 9]>
		<script src="js/html5.js"></script>
		<script src="js/css3-mediaqueries.js"></script>
	<![endif]-->
    
</head>
<body>
<div class="wrap-body">
	<!--////////////////////////////////////Header-->
	<header class="home-header">
		<div class="zerogrid">
			<div class="logo"><div><img src="images/foodLogo.jpg" /></div></div>
			<div class="logo-title">智能点餐系统</div>
		</div>
	</header>
    <!--//////////////////////////////////////Menu-->
	<a href="#" class="nav-toggle">Toggle Navigation</a>
    <nav class="cmn-tile-nav">
		<ul class="clearfix">
			<li class="colour-1"><a href="index.jsp">首页</a></li>
			<li class="colour-2"><a href="gallery.jsp">下午茶</a></li>
			<li class="colour-3"><a href="staff.jsp">鲜果购</a></li>
			<li class="colour-4"><a href="reservation.jsp">精选小吃</a></li>
			<li class="colour-5"><a href="archive.jsp">超市</a></li>
			<li class="colour-6"><a href="news.jsp">精选介绍</a></li>
			<li class="colour-4"><a href="menu.jsp">购物车</a></li>
			<li class="colour-3"><a href="login.jsp">登录</a></li>
			<li class="colour-2"><a href="manager.jsp">用户管理</a></li>
			<li class="colour-1"><a href="order.jsp">查看订单</a></li>
		</ul>
    </nav>
	
	<div class="zerogrid">
		<div class="callbacks_container">
			<ul class="rslides" id="slider4">
				<li>
					<img src="images/banner_1.jpg" alt="">
					<div class="caption">
						<h2>【今日精选】菲力牛排</h2></br>
						<p>菲力牛排指的是牛里脊肉。在澳洲，这块肉被称为“眼菲力”，在法国和英国被称为filet和fillet，中文音译菲力。菲力牛排就是用一定厚度的牛里脊肉做出的牛排。</p>
					</div>
				</li>
				<li>
					<img src="images/banner_2.jpg" alt="">
					<div class="caption">
						<h2>【今日精选】鲤鱼跃龙门</h2></br>
						<p>鲤鱼跃龙门的故事，相信大家上学的时候都没有少听，年夜饭的时候吃条鲤鱼，这在我还小的时候，似乎就已经成了“习惯”，既寓意着年年有余，也寓意着大跃进。</p>
					</div>
				</li>
				<li>
					<img src="images/banner_3.jpg" alt="">
					<div class="caption">
						<h2>【今日精选】桂林米粉</h2></br>
						<p>今日必点之一，桂林米粉！吃过的朋友都说好吃，销售的米粉可绕地球100圈！</p>
					</div>
				</li>
			</ul>
		</div>
	</div>
	
<!--////////////////////////////////////Container-->
<section id="container" class="index-page">
	<div class="wrap-container zerogrid">
		<!-----------------content-box-1-------------------->
		<section class="content-box box-1">
			<div class="zerogrid">
				<div class="row box-item"><!--Start Box-->
					<h2>如果食物是一种体验，那么尽情到店享受！</h2>
					<span>今日前100名用户还有神秘礼物哦~</span>
				</div>
			</div>
		</section>
		<!-----------------content-box-2-------------------->
		<section class="content-box box-2">
			<div class="zerogrid">
				<div class="row wrap-box"><!--Start Box-->
					<div class="header">
						<h2>优选商家</h2>
						<hr class="line">
					</div>
					<div class="row">
						<div class="col-1-3">
							<div class="wrap-col">
								<div class="box-item">
									<span class="ribbon">肯德基<b></b></span>
									<img src="http://p1.meituan.net/xianfu/f49c565f3c4d51fda6c40a29ca6ff05e16938.jpg" alt="">
									<p>肯德基宅急送（万达店）<br>起送：¥0 配送费：¥9</p>
									
								</div>
							</div>
						</div>
						<div class="col-1-3">
							<div class="wrap-col">
								<div class="box-item">
									<span class="ribbon">玛格丽塔<b></b></span>
									<img src="http://p0.meituan.net/xianfu/8e2446baf9924f57e6275ef79851c48715932.jpg" alt="">
									<p>玛格丽塔现烤披萨（万达店）<br>起送：¥38 配送费：¥4</p>
									
								</div>
							</div>
						</div>
						<div class="col-1-3">
							<div class="wrap-col">
								<div class="box-item">
									<span class="ribbon">汀州佬<b></b></span>
									<img src="http://p0.meituan.net/xianfu/529db7ba1eb37df6e3b2930f74ba5bfc33581.jpg" alt="">
									<p>汀州佬（金祥店）<br>起送：¥20 配送费：¥4</p>
									
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-1-3">
							<div class="wrap-col">
								<div class="box-item">
									<span class="ribbon">烧胜一筹<b></b></span>
									<img src="http://p0.meituan.net/xianfu/35d07254803fc8adba3a847971d33bf355296.jpg" alt="">
									<p>烧胜一筹（烤肉拌饭）<br>起送：¥15 配送费：¥2</p>
									
								</div>
							</div>
						</div>
						<div class="col-1-3">
							<div class="wrap-col">
								<div class="box-item">
									<span class="ribbon">CoCo都可<b></b></span>
									<img src="http://p0.meituan.net/xianfu/a08729067e17583c554fc16a647a84639601.jpg" alt="">
									<p>CoCo都可（万达店）<br>起送：¥20 配送费：¥5</p>
									
								</div>
							</div>
						</div>
						<div class="col-1-3">
							<div class="wrap-col">
								<div class="box-item">
									<span class="ribbon">鸡排风云<b></b></span>
									<img src="http://p0.meituan.net/xianfu/8c14b485df050c14a2234d886836c17d75149.jpg" alt="">
									<p>鸡排风云（金祥路）<br>起送：¥40 免配送费</p>
									
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</section>
	</div>
</section>

<!--////////////////////////////////////Footer-->
<footer class="zerogrid">
	<div class="wrap-footer">
		<div class="row">
			
			<div class="col-1-3">
				<div class="wrap-col">
				</div>
			</div>
			<div class="col-1-3">
				<div class="wrap-col">
					<h4>联系客服</h4>
					<p>0594-1234567</p>
					<p>周一至周日 9:00-23:00</p>
					<p>客服不受理商务合作</p>
				</div>
			</div>
		</div>
	</div>
	<div class="copyright">
		<div class="wrapper">
			<a target="_blank" href="#"></a>
			<ul class="quick-link f-right">
			</ul>
		</div>
	</div>
</footer>


	<!-- js -->
	<script src="js/classie.js"></script>
	<script src="js/demo.js"></script>

	<script src="js/jquery-1.11.3.min.js"></script>
	<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
	<script src="js/responsiveslides.min.js"></script>
	<script>
	$(function () {
		// $(window).scroll(function(){
		// 	if($(window).scrollTop()>90){
		// 		$(".cmn-tile-nav").addClass('fixed');
		// 	}else{
		// 		$(".cmn-tile-nav").removeClass('fixed');
		// 	}
		// })
	  // Slideshow 4
	  $("#slider4").responsiveSlides({
		auto: true,
		pager: false,
		nav: false,
		speed: 500,
		namespace: "callbacks",
		before: function () {
		  $('.events').append("<li>before event fired.</li>");
		},
		after: function () {
		  $('.events').append("<li>after event fired.</li>");
		}
	  });
	  
	  $('.box-item').hover(function(){
	  	$(this).css('background', '#F7F7F7');
	  	$(this).css('cursor', 'pointer');
	  }, function() {
	  	$(this).css('background', '#FFF');
	  });
	  
	  $('.box-item').click(function() {
	  	window.location.href = "shopDetail.jsp";
	  	var name = $(this).find('.ribbon').text();
	  	localStorage.shopName = name;
	  });
	});
	</script>
</div>
</body></html>